
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  <title>智能储物柜管理系统</title>
</head>
<style type="text/css">
  .body{
    width: 1100px;
    height: 800px;
    margin: auto;
    border:1px black solid;
    padding: 0px;

  }
  #header{
    float: left;
    height: 100px;
    width: 1070px;
    border: 1px black solid;
    background-color:#6CA6CC; 
    color: #E8F8FC;
    overflow: hidden;
    padding: 15px;
  }
h1{
  float:left;
}

  .img{
    padding: 7px;  
  }
  .left{
    height: 600px;
    width: 280px;
    border: 1px #EBEBEB solid;
    background-color: #F0FFF0;
    text-align: left;
    float: left;
  }
   .aa{
    width: 270px;
    height: 30px;
    background-color: #6CA6CD;
    color: #E8F8FC;
    float: left;
  } 
  .bb{
    width: 270px;
    height: 30px;
    background-color: #6CA6CD;
    color: #E8F8FC;
    float: left;    
  }
  h3,h2{
    font-size: 15px;
  }
  input,button
  {
  padding: 2px;
  }
  .main{
    overflow: hidden;
  }
  .right{
    height: 670px;
    width: 810px;
    border: 1px #EBEBEB solid;
    float: right;
  }
  .main{
    overflow: hidden;
  }
  .box1{
     border:1px;
   width:100px;
   height:98px;
   background-color:#87CEEB;
   float:left;
   margin-centre:-15px;
   margin-left:10px;
 }
 .user{
   margin-left: 100px;
   margin-top:30px;
     float: left;
}
.img-font{
    float: left;
   margin-top:35px;
   margin-left:10px;
   }
.font-img{
   float: left;
   margin-top:30px;
   margin-left:50px;
 }
  .footer{
    background-color:#6CA6CD;
  color:white;
    width: 1100px;
    height: 50px;
    margin: auto;
    text-align:center;
    line-height: 50px;
  }
  table
  {
  border-collapse:collapse;
  margin-left:20px;
  }

table, td, th,
  {
  border:1px solid black;
  padding: 2px;
  }
  input
  {
  padding: 4px;
  border:2px;
  }
</style>
<body>
<div class="body">
  <div id="header">
    <h1>智能储物柜管理系统</h1>
    <div class="box1">
      <p style="text-align:center;"><img src="renwu/img/star.png" width="30" height="30"></p>
      <p style="text-align:center;">高级管理</p>
    </div>
    <div class="box1">
      <p style="text-align:center;"><img src="renwu/img/star.png" width="30" height="30"></p>
      <p style="text-align:center;">历史记录</p>
    </div>
    <div class="box1">
      <p style="text-align:center;"><img src="renwu/img/star.png" width="30" height="30"></p>
      <p style="text-align:center;">其它</p>
    </div>
    <div class="user"><img src="renwu/img/user.png" width="30" height="30"></div>
    <div class="img-font">admin</div>
    <div class="font-img"><img src="renwu/img/home.png" width="30" height="30"></div>
    <div class="img-font">首页</div>
    <div class="font-img"><img src="renwu/img/exit.png" width="30" height="30"></div>
    <div class="img-font">退出</div>
  </div>

  <div class="left">
        <input type="text"style="width: 230px; height: 20px;"><button onclick="myClick();">搜索</button>
        <p><div class="aa">
           <h2>按柜子</h2>                            
           <img src="renwu/img/noexpand.png"style="width:30px; height:30px;position:absolute;left:345px;top:182px;"></p>
           </div>
     <p>电阻柜</p>
     <p>二极管</p>
     <p>三极管</p>
     <p>排阻</p>
     <p>电机</p>
     <p>驱动芯片</p>
     <p>稳压芯片</p>
        <p><div class="bb">
           <h3>按类型</h3>                           
           <img src="renwu/img/expand.png"style="width:30px; height:30px;position:absolute;left:345px;top:450px;"></p>
           </div>
  </div>
  <div class="right">
     <div class="manage">
     <p>
      <input type="button" style="background-color:#6CA6CD;color:white;width: 100px; height: 35px;font-size:18px;" value="柜子管理"/>  
      <input type="button" style="background-color:#6CA6CD;color:white;width: 100px; height: 35px;font-size:18px;" value="元器件管理"/>  
      <input type="button" style="background-color:#6CA6CD;color:white;width: 100px; height: 35px;font-size:18px;" value="用户管理"/></p>
     <p><input type="button" style="background-color:#6CA6CD;color:white;" value="添加"/> </p>
      <table border="1" width="85%" bordercolor="#777777" bgcolor="white"> 
    <tr>
        <th>名称</th>
        <th>描述</th>
        <th>操作</th>
    </tr>
    <tr>
        <td>电容柜</td>
        <td>这是存放电容的柜子，有电解电容，普通电容等等</td>
        <td><a href="http://www.baidu.com"style="text-decoration: none">修改</a>/<a href="http://www.baidu.com"style="text-decoration: none">删除</a></td>
    </tr>
    <tr>
        <td>电阻柜</td>
        <td>第二排第三个</td>
        <td><a href="http://www.baidu.com"style="text-decoration: none">修改</a>/<a href="http://www.baidu.com"style="color:blue;text-decoration: none">删除</a></td>
    </tr>
    <tr>
        <td>二极管</td>
        <td>第一排第三个</td>
        <td><a href="http://www.baidu.com"style="color:blue;text-decoration: none">修改</a>/<a href="http://www.baidu.com"style="color:blue;text-decoration: none">删除</a></td>
    </tr>
    <tr>
        <td>三极管</td>
        <td>第一排第二个 </td>
        <td><a href="http://www.baidu.com"style="color:blue;text-decoration: none">修改</a>/<a href="http://www.baidu.com"style="color:blue;text-decoration: none">删除</a></td>
    </tr>
    <tr>
        <td>排阻</td>
        <td>第二排第八个</td>
        <td><a href="http://www.baidu.com"style="color:blue;text-decoration: none">修改</a>/<a href="http://www.baidu.com"style="color:blue;text-decoration: none">删除</a></td>
    </tr>
        <tr>
        <td>电机</td>
        <td>第二排第二个</td>
        <td><a href="http://www.baidu.com"style="color:blue;text-decoration: none">修改</a>/<a href="http://www.baidu.com"style="color:blue;text-decoration: none">删除</a></td>
    </tr>
        <tr>
        <td>驱动芯片 </td>
        <td>第二排第七个</td>
        <td><a href="http://www.baidu.com"style="color:blue;text-decoration: none">修改</a>/<a href="http://www.baidu.com"style="color:blue;text-decoration: none">删除</a></td>
    </tr>
        <tr>
        <td>稳压芯片 </td>
        <td>第二排第五个</td>
        <td><a href="http://www.baidu.com"style="color:blue;text-decoration: none">修改</a>/<a href="http://www.baidu.com"style="color:blue;text-decoration: none">删除</a></td>
    </tr>
</table>
    </div>
  </div>
</div>
<div class="footer">
  <p>@2014广东石油化工学院主教东905智能家居创新实验室</p>
</div>
</body>
</html>
